<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>Documnent</title>
		<!--1. 导入vue的包-->
		<script type="text/javascript" src="../js/vue.min.js" ></script>
	</head>
	<body>
		<!--将来new 的Vue实例，会控制这个元素中的所有内容-->
		<!--Vue 实例所控制的这个元素区域，就是V-->
		<dv id="app">
			<!--vue指令：{{}}-->
			<p>{{msg}}</p>
		</dv>
	</body>
	
	<script>
		//2.创建一个Vue的实例
		//当我们导入vue包之后，在浏览器的内存中,就多了一个Vue构造函数
		//注意:new 出来的这个vm对象，就是MVVM中的 VM调度者
		var vm=new Vue({
			el:"#app", //表示当前new的这个Vue实例，要控制页面上的那个区域
			//data就是MVVM中的M，用于专门保存每个页面的数据 
			data:{  //data属性中，存放的是 el 中要用到的数据
				msg:"欢迎学习vue" //通过vue提供的指令，很方便的就能把数据渲染到页面上,程序员不需要手动操作DOM元素
			}
		})
	</script>
</html>
